<!DOCTYPE html>
<html>
<head>
    <title>RapidCRM Login Page</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link REL="SHORTCUT ICON" HREF="${ctx}/layouts/vlayout/skins/images/favicon.ico">
    <!-- for Login page we are added -->
    <link href="${ctx}/libraries/bootstrap/css/bootstrap.min.css" rel="stylesheet">
    <link href="${ctx}/libraries/bootstrap/css/bootstrap-responsive.min.css" rel="stylesheet">
    <link href="${ctx}/libraries/bootstrap/css/jqueryBxslider.css" rel="stylesheet" />
    <script src="${ctx}/libraries/jquery/jquery.min.js"></script>
    <script src="${ctx}/libraries/jquery/boxslider/jqueryBxslider.js"></script>
    <script src="${ctx}/libraries/jquery/boxslider/respond.min.js"></script>
    <script>
        jQuery(document).ready(function(){
            scrollx = jQuery(window).outerWidth();
            window.scrollTo(scrollx,0);
            slider = jQuery('.bxslider').bxSlider({
                auto: true,
                pause: 4000,
                randomStart : true,
                autoHover: true
            });
            jQuery('.bx-prev, .bx-next, .bx-pager-item').live('click',function(){ slider.startAuto(); });
        });
    </script>
</head>
<body>
<div class="container-fluid login-container">
    <div class="row-fluid">
        <div class="span3">
            <div class="logo"><img src="${ctx}/layouts/vlayout/skins/images/logo.png">
                <br />
                <a target="_blank" href="http://www.ccjicheng.com"><@vtranslate "company_details.name"/></a>
            </div>
        </div>
        <div class="span9">
            <div class="helpLinks">
                <a href="http://www.ccjicheng.com/chanpinjieshao">Carpo Website</a> |
                <a href="http://www.ccjicheng.com/xinwenzhongxin/qiyewenku/">Carpo Wiki</a> |
                <a href="http://www.ccjicheng.com/changjianwenti/xiaoshou/">Carpo Videos </a> |
                <a href="http://www.ccjicheng.com/xinwenzhongxin/">Carpo Forums</a>
            </div>
        </div>
    </div>
    <div class="row-fluid">
        <div class="span12">
            <div class="content-wrapper">
                <div class="container-fluid">
                    <div class="row-fluid">
                        <div class="span6">
                            <div class="carousal-container">
                                <div><h2> <@vtranslate "rapidcrm.getmore"/> </h2></div>
                                <ul class="bxslider">
                                    <li>
                                        <div id="slide01" class="slide">
                                            <img class="pull-left" src="<@vimage_path_noskin 'android_text.png'/>">
                                            <img class="pull-right" src="<@vimage_path_noskin 'android.png'/>"/>
                                        </div>
                                    </li>
                                    <li>
                                        <div id="slide02" class="slide">
                                            <img class="pull-left" src="<@vimage_path_noskin 'iphone_text.png'/>"/>
                                            <img class="pull-right" src="<@vimage_path_noskin 'iphone.png'/>"/>
                                        </div>
                                    </li>
                                    <li>
                                        <div id="slide03" class="slide">
                                            <img class="pull-left" src="<@vimage_path_noskin 'ipad_text.png'/>"/>
                                            <img class="pull-right" src="<@vimage_path_noskin 'ipad.png'/>"/>
                                        </div>
                                    </li>
                                    <li>
                                        <div id="slide04" class="slide">
                                            <img class="pull-left" src="<@vimage_path_noskin 'exchange_conn_text.png'/>"/>
                                            <img class="pull-right" src="<@vimage_path_noskin 'exchange_conn.png'/>"/>
                                        </div>
                                    </li>
                                    <li>
                                        <div id="slide05" class="slide">
                                            <img class="pull-left" src="<@vimage_path_noskin 'outlook_text.png'/>"/>
                                            <img class="pull-right" src="<@vimage_path_noskin 'outlook.png'/>"/>
                                        </div>
                                    </li>
                                </ul>
                            </div>
                        </div>
                        <div class="span6">
                            <div class="login-area">
                                <div class="login-box" id="loginDiv">
                                    <div class="">
                                        <h3 class="login-header"><@vtranslate "login.title"/></h3>
                                    </div>
                                    <form class="form-horizontal login-form" style="margin:0;" action="${ctx}/"
                                          method="POST">
                                        <#if (rapidcrm.login.error)??>
                                            <div class="alert alert-error">
                                                <p>Invalid username or password.</p>
                                            </div>
                                        </#if>
                                        <#if (rapidcrm.login.fpError)??>
                                            <div class="alert alert-error">
                                                <p>Invalid Username or Email address.</p>
                                            </div>
                                        </#if>
                                        <#if (rapidcrm.login.status)??>
                                        <div class="alert alert-success">
                                            <p>Mail has been sent to your inbox, please check your e-mail.</p>
                                        </div>
                                        </#if>
                                        <#if (rapidcrm.login.statusError)??>
                                        <div class="alert alert-error">
                                            <p>Outgoing mail server was not configured.</p>
                                        </div>
                                        </#if>
                                        <div class="control-group">
                                            <label class="control-label" for="username"><b><@vtranslate "login.username"/></b></label>
                                            <div class="controls">
                                                <input type="text" id="username" name="username" value="admin" placeholder="<@vtranslate "login.username"/>">
                                            </div>
                                        </div>

                                        <div class="control-group">
                                            <label class="control-label" for="password"><b><@vtranslate "login.password"/></b></label>
                                            <div class="controls">
                                                <input type="password" id="password" name="password" placeholder="<@vtranslate "login.password"/>">
                                            </div>
                                        </div>
                                        <div class="control-group signin-button">
                                            <div class="controls" id="forgotPassword">
                                                <button type="submit" class="btn btn-primary sbutton"><@vtranslate "login.sign_in"/></button>
                                                &nbsp;&nbsp;&nbsp;<a><@vtranslate "login.forgot_password"/> ?</a>
                                            </div>
                                        </div>
                                        <#--Retain this tracker to help us get usage details-->
                                        <img src='//stats.rapidcrm.com/stats.php?uid=${APPUNIQUEKEY!}&v=${CURRENT_VERSION!}&type=U' alt='' title='' border=0 width='1px' height='1px'>
                                    </form>
                                    <div class="login-subscript">
                                        <small> <@vtranslate code="POWEREDBY" args=[CURRENT_VERSION!]/></small>
                                    </div>
                                </div>

                                <div class="login-box hide" id="forgotPasswordDiv">
                                    <form class="form-horizontal login-form" style="margin:0;" action="forgotPassword.php" method="POST">
                                        <div class="">
                                            <h3 class="login-header"><@vtranslate "login.forgot_password"/></h3>
                                        </div>
                                        <div class="control-group">
                                            <label class="control-label" for="user_name"><b><@vtranslate "login.username"/></b></label>
                                            <div class="controls">
                                                <input type="text" id="user_name" name="user_name" placeholder="<@vtranslate "login.username"/>">
                                            </div>
                                        </div>
                                        <div class="control-group">
                                            <label class="control-label" for="email"><b><@vtranslate "email"/></b></label>
                                            <div class="controls">
                                                <input type="text" id="emailId" name="emailId"  placeholder="<@vtranslate "email"/>">
                                            </div>
                                        </div>
                                        <div class="control-group signin-button">
                                            <div class="controls" id="backButton">
                                                <input type="submit" class="btn btn-primary sbutton" value="<@vtranslate "submit"/>" name="retrievePassword">
                                                &nbsp;&nbsp;&nbsp;<a><@vtranslate "back"/></a>
                                            </div>
                                        </div>
                                    </form>
                                </div>

                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<div class="navbar navbar-fixed-bottom">
    <div class="navbar-inner">
        <div class="container-fluid">
            <div class="row-fluid">
                <div class="span6 pull-left" >
                    <div class="footer-content">
                        <small>&#169; 2004-${.now?string["YYYY"]}&nbsp;
                            <a href="https://www.rapidcrm.com"> rapidcrm.com</a> |
                            <a href="https://www.rapidcrm.com/LICENSE.txt">Read License</a> |
                            <a href="https://www.rapidcrm.com/products/crm/privacy_policy.html">Privacy Policy</a> </small>
                    </div>
                </div>
                <div class="span6 pull-right" >
                    <div class="pull-right footer-icons">
                        <small><@vtranslate "connect_with_us"/>&nbsp;</small>
                        <a href="https://www.facebook.com/rapidcrm"><img src="${ctx}/layouts/vlayout/skins/images/facebook.png"></a>
                        &nbsp;<a href="https://twitter.com/rapidcrm"><img src="${ctx}/layouts/vlayout/skins/images/twitter.png"></a>
                        &nbsp;<a href="https://www.linkedin.com/company/rapidcrm-systems-india-pvt-ltd"><img src="${ctx}/layouts/vlayout/skins/images/linkedin.png"></a>
                        &nbsp;<a href="http://www.youtube.com/user/rapidcrm"><img src="${ctx}/layouts/vlayout/skins/images/youtube.png"></a>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<script>
    jQuery(document).ready(function(){
        jQuery("#forgotPassword a").click(function() {
            jQuery("#loginDiv").hide();
            jQuery("#forgotPasswordDiv").show();
        });

        jQuery("#backButton a").click(function() {
            jQuery("#loginDiv").show();
            jQuery("#forgotPasswordDiv").hide();
        });

        jQuery("input[name='retrievePassword']").click(function (){
            var username = jQuery('#user_name').val();
            var email = jQuery('#emailId').val();

            var email1 = email.replace(/^\s+/,'').replace(/\s+$/,'');
            var emailFilter = /^[^@]+@[^@.]+\.[^@]*\w\w$/ ;
            var illegalChars= /[\(\)\<\>\,\;\:\\\"\[\]]/ ;

            if(username == ''){
                alert('Please enter valid username');
                return false;
            } else if(!emailFilter.test(email1) || email == ''){
                alert('Please enater valid email address');
                return false;
            } else if(email.match(illegalChars)){
                alert( "The email address contains illegal characters.");
                return false;
            } else {
                return true;
            }

        });
    });
</script>
</body>
</html>